@charset "utf-8";

* {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body,
h1,
h2,
h3,
p,
div,
ol,
ul,
input,
button {
	margin: 0;
	padding: 0
}

body {
	-webkit-text-size-adjust: 100%;
	color: #333333;
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	overflow-x: hidden;
	font-family: PingFangSC-Regular, Helvetica, "Droid Sans", Arial, sans-serif;
}

ol,
ul {
	list-style: none
}

a {
	color: #333333;
	text-decoration: none;
}

input,
button,
textarea {
	border: 0;
	border-radius: 0;
	background: transparent;
	-webkit-appearance: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;
}

button {
	outline: none
}

.view {
	position: absolute;
	width: 750px;
	height: 100%;
	overflow: hidden;
	left: 50%;
	margin-left: -375px;
}

.page {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: cover;
	background-position: center;

	display: none;
}

.poin_none {
	pointer-events: none;
}

.page_transition {
	transition: transform 0.45s ease;
	-ms-transition: transform 0.45s ease;
	-moz-transition: transform 0.45s ease;
	-webkit-transition: transform 0.45s ease;
}

.page_box {
	position: absolute;
	width: 100%;
	height: auto;
	left: 0;
	top: 0;
}

.page_box.fill {
	height: 100%;
}

.page_box.cover {}

.page_box.contain {}

.scrollview {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.preload {
	display: none;
}

.preload img {
	width: 1px;
	height: 1px;
	display: none;
}

.music_btn {
	position: fixed;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	height: 50px;
	width: 50px;
	top: 20px;
	right: 20px;
}

.music_play {
	background-image: url(../img/music.png);
	animation: shunshi 2s 0s linear infinite;
}

.music_pause {
	background-image: url(../img/music_close.png);
}

.page_0 {
	display: block;
}

.loader_spin {
	position: absolute;
	width: 140px;
	height: auto;
	top: 50%;
	left: 0;
	right: 0;
	margin: -70px auto auto auto;
	animation: shunshi 2s 0s linear infinite;
	-webkit-animation: shunshi 2s 0s linear infinite;
}

.loader_text {
	position: absolute;
	width: 100%;
	height: 140px;
	left: 0%;
	top: 50%;
	text-align: center;
	line-height: 140px;
	font-size: 36px;
	color: white;
	margin-top: -70px;
}

.page_1 {
	background-image: url(../img/bg_1.jpg);
}

.p_1_9 {
	position: absolute;
	width: 717px;
	height: auto;
	left: 16px;
	top: 722px;
	opacity: 0;
	animation: leftin 1s 0s ease-in-out forwards;
}

.p_1_8 {
	position: absolute;
	width: 316px;
	height: auto;
	left: 61px;
	top: 46px;
}

.p_1_7 {
	position: absolute;
	width: 213px;
	height: auto;
	left: 274px;
	top: 180px;
}

.p_1_6 {
	position: absolute;
	width: 469px;
	height: 84px;
	left: 130px;
	top: 1286px;
	opacity: 0;
	background-size: cover;
	background-image: url(../img/p_1_6.png);
	animation: fadeIn  1s 2s ease-in-out forwards,btn 1s -1s ease-in-out infinite alternate;
}

.p_1_5 {
	position: absolute;
	width: 131px;
	height: auto;
	left: 294px;
	top: 487px;
	opacity: 0;
	animation: bottomin 1s 0.5s ease-in-out forwards;
}

.p_1_4 {
	position: absolute;
	width: 122px;
	height: auto;
	left: 302px;
	top: 144px;
	opacity: 0;
	animation: topin 1s 0.5s ease-in-out forwards;
}

.p_1_3 {
	position: absolute;
	width: 39px;
	height: auto;
	left: 234px;
	top: 254px;
	opacity: 0;
	animation: shine 1s 1.5s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_1_2 {
	position: absolute;
	width: 39px;
	height: auto;
	left: 491px;
	top: 533px;
	opacity: 0;
	animation: shine 1s 1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_1_1 {
	position: absolute;
	width: 278px;
	height: auto;
	left: 232px;
	top: 342px;
	opacity: 0;
	animation: fadeIn 1s 1s ease-in-out forwards;
}

.p_1_0 {
	position: absolute;
	width: 193px;
	height: auto;
	left: 277px;
	top: 340px;
	opacity: 0;
	animation: sbin 1s 0.5s ease-in-out forwards;
}

.page_2 {
	background-image: url(../img/bg_2.jpg);
}

.p_2_anwer {
	position: absolute;
	left: 0;
	width: 100%;
	height: 78px;
}

.p_2_anwer1 {
	top: 932px;
	opacity: 0;
	animation: bottomin 1s 1s ease-in-out forwards;
}

.p_2_anwer2 {
	top: 1065px;
	opacity: 0;
	animation: bottomin 1s 1.2s ease-in-out forwards;
}

.p_2_10 {
	position: absolute;
	width: 284px;
	height: auto;
	left: 311px;
	top: 12px;
}

.p_2_9 {
	position: absolute;
	width: 437px;
	height: 78px;
	left: 229px;
	top: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(../img/p_2_11.png);
}

.p_2_anwer.active .p_2_9 {
	background-image: url(../img/p_2_9.png);
}

.p_2_8 {
	position: absolute;
	width: 285px;
	height: auto;
	left: 310px;
	top: 12px;
}

.p_2_7 {
	position: absolute;
	width: 508px;
	height: auto;
	left: 159px;
	top: 682px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_2_6 {
	position: absolute;
	width: 64px;
	height: auto;
	left: 148px;
	top: 6px;
}

.p_2_5 {
	position: absolute;
	width: 64px;
	height: auto;
	left: 148px;
	top: 6px;
}

.p_2_4 {
	position: absolute;
	width: 466px;
	height: auto;
	left: 188px;
	top: 97px;
	opacity: 0;
	animation: sbin 1s 0.5s ease-in-out forwards;
}

.p_2_3 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 68px;
	top: 126px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_2_2 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 177px;
	top: 1211px;
}

.p_2_1 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 44px;
	top: 148px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s ease-in-out forwards;
}

.p_2_0 {
	position: absolute;
	width: 34px;
	height: auto;
	left: 53px;
	top: 847px;
	opacity: 0;
	animation: leftin 1s 0.5s ease-in-out forwards;
}

.page_3 {
	background-image: url(../img/bg_3.jpg);
}

.p_3_15 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 595px;
	top: 96px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.p_3_14 {
	position: absolute;
	width: 447px;
	height: auto;
	left: 66px;
	top: 207px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_3_13 {
	position: absolute;
	width: 178px;
	height: auto;
	left: 481px;
	top: 973px;
	opacity: 0;
	animation: rightin 1s 0.5s ease-in forwards, swing 1.5s 0s ease-in-out infinite alternate;
}

.p_3_12 {
	position: absolute;
	width: 177px;
	height: auto;
	left: 301px;
	top: 979px;
	opacity: 0;
	animation: leftin 1s 0.5s ease-in forwards, swing 1.5s 0s ease-in-out infinite alternate;
}

.p_3_11 {
	position: absolute;
	width: 147px;
	height: auto;
	left: 440px;
	top: 861px;
	opacity: 0;
	transform-origin: bottom;
	animation: sbin 0.3s 1.3s ease-in forwards, ufo 2s 0s ease infinite alternate;
}

.p_3_10 {
	position: absolute;
	width: 601px;
	height: auto;
	left: 152px;
	top: 1009px;
	opacity: 0;
	animation: fadeIn 1s 1.3s ease-in forwards;
}

.p_3_anwer {
	position: absolute;
	left: 0;
	width: 100%;
	height: 140px;
}

.p_3_anwer1 {
	top: 497px;
	opacity: 0;
	animation: leftin 1s 1.5s ease-in forwards;
}

.p_3_anwer2 {
	top: 675px;
	opacity: 0;
	animation: leftin 1s 1.7s ease-in forwards;
}

.p_3_8 {
	position: absolute;
	width: 120px;
	height: auto;
	left: 223px;
	top: 42px;
}

.p_3_7 {
	position: absolute;
	width: 428px;
	height: 140px;
	left: 68px;
	top: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(../img/p_3_9.png);
}

.p_3_anwer.active .p_3_7 {
	background-image: url(../img/p_3_7.png);
}

.p_3_6 {
	position: absolute;
	width: 79px;
	height: auto;
	left: 234px;
	top: 45px;
}

.p_3_5 {
	position: absolute;
	width: 40px;
	height: auto;
	left: 81px;
	top: 18px;
}

.p_3_4 {
	position: absolute;
	width: 45px;
	height: auto;
	left: 79px;
	top: 18px;
}

.p_3_3 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 56px;
	top: 409px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1.2s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_3_2 {
	position: absolute;
	width: 55px;
	height: auto;
	left: 685px;
	top: 996px;
	opacity: 0;
	animation: fadeIn 1s 2s ease-in-out forwards,shine 1s 3s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_3_1 {
	position: absolute;
	width: 55px;
	height: auto;
	left: 236px;
	top: 1265px;
	opacity: 0;
	animation: fadeIn 1s 2s ease-in-out forwards,shine 1s 3.5s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_3_0 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 619px;
	top: 75px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.page_4 {
	background-image: url(../img/bg_4.jpg);
}

.p_4_12 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 44px;
	top: 148px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.p_4_anwer {
	position: absolute;
	left: 219px;
	width: 486px;
}

.p_4_anwer1 {
	top: 867px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_4_anwer2 {
	top: 1000px;
	opacity: 0;
	animation: bottomin 1s 1.7s ease-in-out forwards;
}

.p_4_anwer3 {
	top: 1135px;
	opacity: 0;
	animation: bottomin 1s 1.9s ease-in-out forwards;
}

.p_4_anwer img {
	position: absolute;
	width: 486px;
	height: auto;
	left: 0;
	top: 0;
}

.p_4_anwer img:first-child {
	display: block;
}

.p_4_anwer img:last-child {
	display: none;
}

.p_4_anwer.active img:first-child {
	display: none;
}

.p_4_anwer.active img:last-child {
	display: block;
}

.p_4_10 {
	position: absolute;
	width: 64px;
	height: auto;
	left: 138px;
	top: 873px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_4_8 {
	position: absolute;
	width: 64px;
	height: auto;
	left: 138px;
	top: 1006px;
	opacity: 0;
	animation: bottomin 1s 1.7s ease-in-out forwards;
}


.p_4_6 {
	position: absolute;
	width: 64px;
	height: auto;
	left: 138px;
	top: 1141px;
	opacity: 0;
	animation: bottomin 1s 1.9s ease-in-out forwards;
}

.p_4_5 {
	position: absolute;
	width: 518px;
	height: auto;
	left: 139px;
	top: 626px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_4_4 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 620px;
	top: 188px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_4_3 {
	position: absolute;
	width: 416px;
	height: auto;
	left: 255px;
	top: 883px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_4_2 {
	position: absolute;
	width: 414px;
	height: auto;
	left: 253px;
	top: 1016px;
	opacity: 0;
	animation: bottomin 1s 1.7s ease-in-out forwards;
}

.p_4_1 {
	position: absolute;
	width: 347px;
	height: auto;
	left: 264px;
	top: 1155px;
	opacity: 0;
	animation: bottomin 1s 1.9s ease-in-out forwards;
}

.p_4_0 {
	position: absolute;
	width: 407px;
	height: auto;
	left: 185px;
	top: 183px;
	animation: yun_sport 2s 0s ease-in-out infinite alternate;
-webkit-animation: yun_sport 2s 0s ease-in-out infinite alternate;
}

.page_5 {
	background-image: url(../img/bg_5.jpg);
}

.p_5_9 {
	position: absolute;
	width: 426px;
	height: auto;
	left: 61px;
	top: 183px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_5_anwer {
	position: absolute;
	left: 0;
	width: 100%;
	height: 82px;
}

.p_5_anwer1 {
	top: 372px;
	opacity: 0;
	animation: topin 1s 1.5s ease-in-out forwards;
}

.p_5_anwer2 {
	top: 489px;
	opacity: 0;
	animation: topin 1s 1.7s ease-in-out forwards;
}

.p_5_anwer3 {
	top: 610px;
	opacity: 0;
	animation: topin 1s 1.9s ease-in-out forwards;
}

.p_5_anwer4 {
	top: 729px;
	opacity: 0;
	animation: topin 1s 2.1s ease-in-out forwards;
}

.p_5_7 {
	position: absolute;
	width: 455px;
	height: 82px;
	left: 68px;
	top: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(../img/p_5_7.png);
}

.p_5_anwer.active .p_5_7 {
	background-image: url(../img/p_5_8.png);
}

.p_5_6 {
	position: absolute;
	width: 389px;
	height: auto;
	left: 94px;
	top: 15px;
}

.p_5_5 {
	position: absolute;
	width: 395px;
	height: auto;
	left: 91px;
	top: 14px;
}

.p_5_4 {
	position: absolute;
	width: 391px;
	height: auto;
	left: 91px;
	top: 14px;
}

.p_5_3 {
	position: absolute;
	width: 399px;
	height: auto;
	left: 91px;
	top: 15px;
}

.p_5_2 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 595px;
	top: 96px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.p_5_1 {
	position: absolute;
	width: 521px;
	height: auto;
	left: 167px;
	top: 973px;
	opacity: 0;
	animation: bottomin 1s 0.5s ease-in-out forwards;
}

.p_5_0 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 621px;
	top: 698px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.page_6 {
	background-image: url(../img/bg_6.jpg);
}

.p_6_10 {
	position: absolute;
	width: 459px;
	height: auto;
	left: 155px;
	top: 638px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_6_9 {
	position: absolute;
	width: 511px;
	height: auto;
	left: 159px;
	top: 889px;
	opacity: 0;
	animation: fadeIn 1s 3s ease-in-out forwards;
}

.p_6_anwer {
	position: absolute;
	width: 382px;
	height: 70px;
}

.p_6_anwer1 {
	top: 890px;
	left: 159px;
	opacity: 0;
	transform-origin: right;
	animation: sbin 1s 1.7s ease-in-out forwards;
}

.p_6_anwer2 {
	top: 1018px;
	left: 287px;
	opacity: 0;
	transform-origin: right;
	animation: sbin 1s 1.5s ease-in-out forwards;
}

.p_6_7 {
	position: absolute;
	width: 382px;
	height: 70px;
	left: 0;
	top: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(../img/p_6_7.png);
}

.p_6_anwer.active .p_6_7 {
	background-image: url(../img/p_6_8.png);
}

.p_6_6 {
	position: absolute;
	width: 290px;
	height: auto;
	left: 19px;
	top: 15px;
}

.p_6_5 {
	position: absolute;
	width: 314px;
	height: auto;
	left: 19px;
	top: 15px;
}

.p_6_4 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 24px;
	top: 146px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.p_6_3 {
	position: absolute;
	width: 823px;
	height: auto;
	left: -53px;
	top: 1177px;
}

.p_6_2 {
	position: absolute;
	width: 43px;
	height: auto;
	left: 357px;
	top: 1269px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_6_1 {
	position: absolute;
	width: 443px;
	height: auto;
	left: 139px;
	top: 224px;
	opacity: 0;
	animation: rightin 1s 0.5s ease-in-out forwards;
}

.p_6_0 {
	position: absolute;
	width: 52px;
	height: auto;
	left: 559px;
	top: 835px;
	opacity: 0;
	animation: fadeIn 1s 2s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.page_7 {
	background-image: url(../img/bg_7.jpg);
}

.p_7_11 {
	position: absolute;
	width: 304px;
	height: auto;
	left: 68px;
	top: 293px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_7_10 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 595px;
	top: 96px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.p_7_9 {
	position: absolute;
	width: 46px;
	height: auto;
	left: 659px;
	top: 1142px;
	opacity: 0;
	animation: fadeIn 1s 2s ease-in-out forwards,shine 1s -1.3s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_7_8 {
	position: absolute;
	width: 59px;
	height: auto;
	left: 97px;
	top: 1212px;
	opacity: 0;
	animation: fadeIn 1s 2s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_7_7 {
	position: absolute;
	width: 492px;
	height: auto;
	left: 185px;
	top: 932px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_7_6 {
	position: absolute;
	width: 62px;
	height: auto;
	left: 214px;
	top: 1062px;
	opacity: 0;
	animation: sbin 1s 2.3s ease-in-out forwards;
}

.p_7_5 {
	position: absolute;
	width: 60px;
	height: auto;
	left: 584px;
	top: 978px;
	opacity: 0;
	animation: sbin 1s 2s ease-in-out forwards;
}

.p_7_4 {
	position: absolute;
	width: 601px;
	height: auto;
	left: 125px;
	top: 1030px;
	opacity: 0;
	animation: fadeIn 1s 2s ease-in-out forwards;
}

.p_7_anwer {
	position: absolute;
	left: 0;
	width: 100%;
	height: 140px;
}

.p_7_anwer1 {
	top: 491px;
	opacity: 0;
	animation: topin 1s 2.7s ease-in-out forwards;
}

.p_7_anwer2 {
	top: 660px;
	opacity: 0;
	animation: topin 1s 2.9s ease-in-out forwards;
}

.p_7_3 {
	position: absolute;
	width: 428px;
	height: 140px;
	left: 68px;
	top: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(../img/p_7_3.png);
}

.p_7_anwer.active .p_7_3 {
	background-image: url(../img/p_7_1.png);
}


.p_7_2 {
	position: absolute;
	width: 228px;
	height: auto;
	left: 81px;
	top: 18px;
}


.p_7_0 {
	position: absolute;
	width: 230px;
	height: auto;
	left: 81px;
	top: 18px;
}

.page_8 {
	background-image: url(../img/bg_8.jpg);
}

.p_8_19 {
	position: absolute;
	width: 523px;
	height: auto;
	left: 147px;
	top: 379px;
	opacity: 0;
	transform-origin: left;
	animation: txt_y 1s 1s ease-in-out forwards;
}

.p_8_18 {
	position: absolute;
	width: 103px;
	height: auto;
	left: 27px;
	top: 134px;
	opacity: 0;
	transform-origin: top;
	animation: sbin 1s 0s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.p_8_17 {
	position: absolute;
	width: 396px;
	height: auto;
	left: 291px;
	top: 150px;
	opacity: 0;
	animation: topin 1s 0.5s ease-in-out forwards;
}

.p_8_16 {
	position: absolute;
	width: 41px;
	height: auto;
	left: 149px;
	top: 681px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_8_15 {
	position: absolute;
	width: 47px;
	height: auto;
	left: 149px;
	top: 1230px;
	opacity: 0;
	animation: bottomin 1s 2.3s ease-in-out forwards;
}

.p_8_anwer .p_8_bg {
	position: absolute;
	top: 3px;
	left: 16px;
	right: 15px;
	bottom: 19px;
}

.p_8_anwer.active .p_8_bg {
	background-color: #fafadd;
}

.p_8_anwer1 {
	position: absolute;
	width: 416px;
	height: auto;
	left: 217px;
	top: 659px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_8_anwer2 {
	position: absolute;
	width: 356px;
	height: auto;
	left: 217px;
	top: 770px;
	opacity: 0;
	animation: bottomin 1s 1.7s ease-in-out forwards;
}

.p_8_anwer3 {
	position: absolute;
	width: 416px;
	height: auto;
	left: 217px;
	top: 885px;
	opacity: 0;
	animation: bottomin 1s 1.9s ease-in-out forwards;
}

.p_8_anwer4 {
	position: absolute;
	width: 488px;
	height: auto;
	left: 217px;
	top: 1048px;
	opacity: 0;
	animation: bottomin 1s 2.1s ease-in-out forwards;
}

.p_8_anwer5 {
	position: absolute;
	width: 416px;
	height: auto;
	left: 217px;
	top: 1208px;
	opacity: 0;
	animation: bottomin 1s 2.3s ease-in-out forwards;
}

.p_8_9 {
	position: absolute;
	width: 325px;
	height: auto;
	left: 270px;
	top: 678px;
	opacity: 0;
	animation: bottomin 1s 1.5s ease-in-out forwards;
}

.p_8_8 {
	position: absolute;
	width: 46px;
	height: auto;
	left: 152px;
	top: 795px;
	opacity: 0;
	animation: bottomin 1s 1.7s ease-in-out forwards;
}

.p_8_7 {
	position: absolute;
	width: 47px;
	height: auto;
	left: 152px;
	top: 934px;
	opacity: 0;
	animation: bottomin 1s 1.9s ease-in-out forwards;
}

.p_8_6 {
	position: absolute;
	width: 47px;
	height: auto;
	left: 152px;
	top: 1097px;
	opacity: 0;
	animation: bottomin 1s 2.1s ease-in-out forwards;
}

.p_8_5 {
	position: absolute;
	width: 243px;
	height: auto;
	left: 274px;
	top: 786px;
	opacity: 0;
	animation: bottomin 1s 1.7s ease-in-out forwards;
}

.p_8_4 {
	position: absolute;
	width: 323px;
	height: auto;
	left: 274px;
	top: 1224px;
	opacity: 0;
	animation: bottomin 1s 2.3s ease-in-out forwards;
}

.p_8_3 {
	position: absolute;
	width: 325px;
	height: auto;
	left: 251px;
	top: 901px;
	opacity: 0;
	animation: bottomin 1s 1.9s ease-in-out forwards;
}

.p_8_2 {
	position: absolute;
	width: 417px;
	height: auto;
	left: 251px;
	top: 1065px;
	opacity: 0;
	animation: bottomin 1s 2.1s ease-in-out forwards;
}

.p_8_1 {
	position: absolute;
	width: 46px;
	height: auto;
	left: 617px;
	top: 96px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1.2s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.p_8_0 {
	position: absolute;
	width: 46px;
	height: auto;
	left: 62px;
	top: 1294px;
	opacity: 0;
	animation: fadeIn 1s 0.5s ease-in-out forwards,shine 1s -1s ease-in-out infinite alternate, shunshi 2s 0s linear infinite;
}

.page_9 {
	background-image: url(../img/bg_9.jpg);
}

.p_9_4 {
	position: absolute;
	width: 666px;
	height: auto;
	left: 49px;
	top: 144px;
}

.p_9_3 {
	position: absolute;
	width: 114px;
	height: auto;
	left: -9px;
	top: 848px;
}

.p_9_2 {
	position: absolute;
	width: 638px;
	height: auto;
	left: 61px;
	top: 1247px;
	opacity: 0;
	animation: bottomin 1s 0.5s ease-in-out forwards;
}

.p_9_1 {
	position: absolute;
	left: 60px;
	top: 1143px;
	opacity: 0;
	animation: leftin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.p_9_0 {
	position: absolute;
	    left: 501px;
	    top: 1143px;
	    opacity: 0;
	animation: rightin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.page_10 {
	background-image: url(../img/bg_10.jpg);
}

.p_10_3 {
	position: absolute;
	width: 666px;
	height: auto;
	left: 51px;
	top: 144px;
}

.p_10_2 {
	position: absolute;
	width: 638px;
	height: auto;
	left: 61px;
	top: 1247px;
	opacity: 0;
	animation: bottomin 1s 0.5s ease-in-out forwards;
}

.p_10_1 {
	position: absolute;
	left: 60px;
	top: 1143px;
	opacity: 0;
	animation: leftin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.p_10_0 {
	position: absolute;
	    left: 501px;
	    top: 1143px;
	    opacity: 0;
	animation: rightin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.page_11 {
	background-image: url(../img/bg_11.jpg);
}

.p_11_3 {
	position: absolute;
	width: 666px;
	height: auto;
	left: 51px;
	top: 144px;
}

.p_11_2 {
	position: absolute;
	width: 638px;
	height: auto;
	left: 61px;
	top: 1247px;
	opacity: 0;
	animation: bottomin 1s 0.5s ease-in-out forwards;
}

.p_11_1 {
	position: absolute;
	left: 60px;
	top: 1143px;
	opacity: 0;
	animation: leftin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.p_11_0 {
position: absolute;
	    left: 501px;
	    top: 1143px;
	    opacity: 0;
	animation: rightin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.page_12 {
	background-image: url(../img/bg_12.jpg);
}

.p_12_3 {
	position: absolute;
	width: 700px;
	height: auto;
	left: 51px;
	top: 144px;
}

.p_12_2 {
	position: absolute;
	width: 638px;
	height: auto;
	left: 61px;
	top: 1247px;
	opacity: 0;
	animation: bottomin 1s 0.5s ease-in-out forwards;
}

.p_12_1 {
	position: absolute;
	left: 60px;
	top: 1143px;
	opacity: 0;
	animation: leftin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}

.p_12_0 {
	    position: absolute;
	    left: 501px;
	    top: 1143px;
	    opacity: 0;
	animation: rightin 1s 0s ease-in-out forwards,fadeIn1 2s 0s linear infinite;
}
.finger{
	       position: absolute;
	       left: 320px;
	       top: 1040px;
	       z-index: 1;
	       opacity: 0;
	       animation: bottomin 1s 0.5s ease-in-out forwards, btn 1s -1s ease-in-out infinite alternate;
}
@keyframes fadeIn1 {
	0% {
		opacity: 0.2
	}

	50% {
		opacity: 1
	}

	100% {
		opacity: 0.2
	}
}